import React, { useState, useEffect } from 'react';
import { Form, Input, Button } from 'antd';
import {ShoppingOutlined} from '@ant-design/icons';
import axios from 'axios';

export default  (e) => {
  const [form] = Form.useForm();
  const [, forceUpdate] = useState({}); // To disable submit button at the beginning.

  useEffect(() => {
    forceUpdate({});
  }, []);

  const onFinish = (values) => {
    axios.get("http://localhost:3001/api/sousuo",{params:{name:values.goods,token:localStorage.getItem("token")}}).then((req)=>{
      e.sousuo(req)
    })
  };
  
  return (
    <Form  form={form} name="horizontal_login" layout="inline" onFinish={onFinish}>
      <Form.Item
        name="goods"
        rules={[
          {
            required: false,
            message: '请输入商品名称',
          },
        ]}
      >
        <Input prefix={<ShoppingOutlined />} placeholder="商品名称" />
      </Form.Item>
      <Form.Item shouldUpdate>
        {() => (
          <Button
            type="primary"
            htmlType="submit"
            disabled={
              !form.isFieldsTouched(true) ||
              !!form.getFieldsError().filter(({ errors }) => errors.length).length
            }
          >
            Log in
          </Button>
        )}
      </Form.Item>
    </Form>
  );
};